<template>
  <div>
    <!-- v-model 可以双向绑定数据，数据可以驱动视图，视图中的数据发生变化也能够影响data中的数据      -->
     <!-- 注意：v-model会忽略一些默认自带属性比如value ，checked -->
     <!-- <input type="text" v-model="msg"> -->
     <form>
        <input type="text" name="username" v-model="username">

        <input type="text" name="password" v-model.lazy.trim.number="password">

        <button @click.prevent.stop='fn'>提交</button>
    </form>
   </div>
</template>
<script>
export default {
  data() {
    return {
      // msg:'杭州的第一场雪'
      username:'',
      password:'',
    };
  },

  methods: {
    fn(){
      console.log(this.username,this.password);
      
    }
  }
};
</script>

<style scoped>
     
</style>